function drawPieChart(svg){
	pieSVGSize = svg.attr("width");
	transPie = "translate("+(pieSVGSize*.5)+","+(pieSVGSize*.45)+")";
	//transText1 = "rotate(";
	//transText2 = " "+(pieSVGSize/2)+" "+(pieSVGSize/2)+") translate("+(pieSVGSize*.6)+" "+(pieSVGSize/2)+")";

	arc = d3.svg.arc()
		.innerRadius(0)
		.outerRadius(pieSVGSize*.3);
	gPie = svg.append("g").attr("id", "gPieChart");

	// Pie Chart Title
	pieTitle = svg.append("text")
		.attr("x", pieSVGSize/2)
		.attr("y", "10%")
		.attr("id", "pieTitleText")
		.attr("text-anchor", "middle");

	pieDetails = svg.append("text")
		.attr("x", pieSVGSize/2)
		.attr("y", "85%")
		.attr("text-anchor", "middle")
		.attr("id", "pieDetailsText")
		.text("mouse over for details");

	// mapping of file category to category color
	catToColor = {
		"doc":"blue",
		"pic":"orange",
		"layout":"red",
		"spreadsheet":"green",
		"text":"white"
	};

	// mapping of file type to file category
	typeToCat = {
		"doc":"doc",
		"jpg":"pic",
		"pdf":"layout",
		"xls":"spreadsheet",
		"txt":"text"
	};

	refreshPieChart();
}

// when curr folder changes, refreshes the pie chart
function refreshPieChart(){
	pieTitle.text(curr.name);
	gPie.selectAll("path").remove();

	currRad = 0;
	fileTypes = {};
	var numFiles = curr.fileChildren.length;
	for (var i=0; i<numFiles; i++){
		var type = curr.fileChildren[i].type;
		if (fileTypes[type]==null) fileTypes[type] = 1;
		else fileTypes[type] += 1;
	}

	// adds slice for each file type
	for (var t in fileTypes){
		var category = typeToCat[t];
		if (category==null) var color = "grey";
		else color = catToColor[category];
		var perc = fileTypes[t]/numFiles;
		addSlice(color, perc, t, t+": "+fileTypes[t]+" files ("+Math.round(perc*100)+"%)");
	}

}

// add slice to pie chart
function addSlice(color, percent, id, text){
	// pie slice
	var rad = percent*Math.PI*2;	
	currSlice = gPie.append("path")
		.attr("fill", color)
		.attr("transform", transPie)
		.attr("stroke", "black")
		.attr("stroke-width", "1")
		.attr("id", id)
		.datum({
			startAngle: currRad,
			endAngle: currRad+rad,
			percent: percent,
			id:id,
			text:text
		})
		.attr("d",arc)
		.on("mouseover", function(d){
			currSlice.attr("stroke-width", "1");
			pieDetails.text(d.text);
			document.getElementById(d.id).parentNode.appendChild(this);
			currSlice = d3.select("#"+d.id);
			currSlice.attr("stroke-width", "3");
		});

	/*
	// slice text
	gPie.append("text")
		.attr("transform", transText1+((currRad-rad/2)*180/Math.PI)+transText2)
		.attr("transform", "translate(100 100) rotae(45 100 100)")
		.text(text);
	*/

	currRad += rad;
};